<template>
<div>
  <Drawer width="600" title="选择应用场景进入装户图" @on-close="close" :closable="false" v-model="labelModel">
    <div class="container-drawer">
      <div v-for="(item,index) in moduleList" :key="index" >
        <Card v-if="item.is_show === '0' " class="cardclassStyle">
          <p slot="title">
            {{ item.name }}
          </p>
          <CellGroup v-for="(item1,index1) in item.children" :key="index1" >
            <Cell style="height: 40px">
              <div slot="label">
                {{item1.name}}
                <img v-show="item1.label_img" :src="item1.label_img" width="30" height="30">
                <span style="margin-left: 5px" v-if="item1.pid !==undefined && item1.id !=='' && item1.labelNum !== undefined">{{item1.labelNum}} 人</span>
              </div>
              <Button type="primary" slot="extra" shape="circle" icon="ios-search" @click="pickModule(item1)"></Button>
            </Cell>
          </CellGroup>
        </Card>
      </div>
    </div>
  </Drawer>
  <doorplate-info ref="doorplateInfo"></doorplate-info>
</div>
</template>

<script>
import { findLabelListNew } from '../../../../api/eventlist'
import DoorplateInfo from '../doorplate-info'

export default {
  name: 'labelInfo',
  components: { DoorplateInfo },
  data () {
    return {
      labelModel: false,
      result: {},
      moduleList: []
    }
  },
  methods: {
    close () {
      this.$nextTick(() => {
        const ivuDrawerBody = document.querySelector('.container-drawer')
        ivuDrawerBody.scrollTop = 0
      })
    },
    init (e) {
      this.labelModel = true
      this.result = e
      let data = {
        building_id: this.result.id
      }
      findLabelListNew(data).then(ret => {
        if (ret.data.errcode === 0) {
          this.moduleList = ret.data.data
          let data = {
            name: '装户图',
            is_show: '0',
            children: [
              {
                name: '装户图',
                is_show: '0'
              }
            ]
          }
          this.moduleList.unshift(data)
        } else {
          this.$Notice.error({
            title: '查询失败',
            desc: ret.data.errmsg
          })
        }
      })
    },
    pickModule (e) {
      let data = {
        buildingInfo: this.result,
        moduleInfo: e
      }
      console.log('pickModule', data)
      this.$refs.doorplateInfo.init(data)
    }
  }
}
</script>

<style scoped>
.cardclassStyle{
  width:100%;
  margin-bottom: 20px
}
/deep/.ivu-drawer-body{
  overflow-y: auto!important;
}
.container-drawer{
  height: 100%;
  overflow-y: auto;
}
</style>
